import QtQuick 2.12
import QtQuick.Controls 2.5
import QtMultimedia 5.13

Page {
    width: 600
    height: 400


    //    header: Label {
    //        text: qsTr("Page 2")
    //        font.pixelSize: Qt.application.font.pixelSize * 2
    //        padding: 10
    //    }

    //    Label {
    //        text: qsTr("You are on Page 2.")
    //        anchors.centerIn: parent
    //    }



    Rectangle {
        color: "black"
//        color: "transparent"
        anchors.fill: parent

        MediaPlayer {
            id: mp
            source: "file:///g:/videos/qucai.avi"
            loops: MediaPlayer.Infinite
        }

        VideoOutput {
            id: video
            anchors.fill: parent
            source: mp
            fillMode: VideoOutput.Stretch
            flushMode: VideoOutput.FirstFrame
            z: 100
        }
    }


    Rectangle {
        id: btnPlay
        color: "lightgray"
        opacity: 0.5
        anchors.fill: parent
//        Behavior on opacity { PropertyAnimation { duration: 600} }

        MouseArea {
            anchors.fill: parent
            propagateComposedEvents: true
            onClicked: {
                if (mp.playbackState === MediaPlayer.PlayingState) {
                    doStop()
                }
                else {
                    doPlay()
                }
            }
        }

        Image {
            id: chicken
            source: "qrc:/imgs/chicken.png"
            anchors.fill: parent
        }



        Image {
            id: imgPlay
            width: 100
            height: 100
            anchors.centerIn: parent
            source: "qrc:/imgs/play.png"
            Behavior on opacity { PropertyAnimation {duration: 600}}
            Behavior on scale { PropertyAnimation {duration: 600}}
        }

        Image {
            id: steam
        }
    }

    function doPlay() {
        mp.play()
//        mp.seek(50)
        imgPlay.opacity = 0.0
        imgPlay.scale = 1.3
    }

    function doStop() {
        mp.stop()
//        btnPlay.opacity = 0.2
        imgPlay.opacity = 1.0
        imgPlay.scale = 1.0
    }


    Timer {
        id: t
        interval: 200
        repeat: false
        onTriggered: {
            mp.stop()
            mp.muted = false
        }
    }

    Component.onCompleted: {
        mp.muted = true
        mp.play()
        t.start()
    }
}
